<template>
    <div class="content">
        <transition name="move" mode="out-in">
            <keep-alive :include="tagsList">
                <router-view></router-view>
            </keep-alive>
        </transition>
    </div>
</template>

<script>

    export default {
        data() {
            return {
                tagsList: [],
                collapse: false,
                loadingObj: undefined
            }
        },
        components: {},
        methods: {
            /**
             * 关闭进度条
             */
            closeLoading: function () {
                if (this.loadingObj) {
                    this.loadingObj.close();
                }
            }
        },
        created() {
            //会话失败监听,重新登录
            this.$bus.$on(this.$env.TOKEN_INVALID, () => {
                this.closeLoading();
                sessionStorage.removeItem(this.$env.LOGIN_TOKEN);
                sessionStorage.removeItem(this.$env.LOGIN_ROLE);
                this.$router.push('/login');
            });

            this.$bus.$on(this.$env.COLLAPSE, msg => {
                this.collapse = msg;
            });

            // 只有在标签页列表里的页面才使用keep-alive，即关闭标签之后就不保存到内存中了。
            this.$bus.$on(this.$env.TAGS, msg => {
                let arr = [];
                for (let i = 0, len = msg.length; i < len; i++) {
                    msg[i].name && arr.push(msg[i].name);
                }
                this.tagsList = arr;
            });
        },
        destroyed() {
            this.$bus.$off(this.$env.TOKEN_INVALID);
            this.$bus.$off(this.$env.COLLAPSE);
            this.$bus.$off(this.$env.TAGS);
        }
    }
</script>
